<{if $data}>
<div id="slideMain-<{$widgets_id}>" >
<div id="slideshow-<{$widgets_id}>" class="section loading slideshow-defau" style="width:<{$setting.slideshow_width}>px;">
<div style="height:<{$setting.slideshow_height}>px;overflow:hidden;width:<{$setting.slideshow_width}>px;">
	<ol class="shopex-switchable-content slideWrap" style="height:<{$setting.slideshow_height}>px;">
	<{foreach from=$setting.pic item=data key=key}>
	  <li class="slideitem" style="<{if $setting.direction=='Left'}> float:left <{/if}>"><a href="<{$data.linktarget}>"><{if $data.link}><img width="<{$setting.slideshow_width|default:500}>px" height="<{$setting.slideshow_height|default:320}>px"  src="<{$data.link}>" /><{/if}></a> </li>
	<{/foreach}>
	</ol>
</div>
<ul id="num_nav" class="shopex-switchable-triggerBox num_nav clearfix">
	<{foreach from=$setting.pic item=data key=key name="item"}>
	<li>
		<a class="triggers" href="javascript:void(0)" >
			<{$data.linkinfo}>
		</a>
	</li>
  	<{/foreach}>
</ul>
</div>
</div>
<style>
.slideshow-defau { position: relative; border: 1px solid #E5E5E5; overflow: hidden; }
.shopex-switchable-triggerBox {
	background:#F0F0F0;
}
.slideshow-defau .shopex-switchable-triggerBox li {
    float: left;
    width: 125px;
    height: 18px;
    background-color: #F0F0F0;
    color: #333;
    text-align: center;
    cursor: pointer;
	padding:6px 0 6px 0;
}
.slideshow-defau .shopex-switchable-triggerBox li a {
    color: #333;
}
.slideshow-defau .shopex-switchable-triggerBox li.active, #slideshow .shopex-switchable-triggerBox li.active a {
    width: 125px;
    height: 18px;
    color: #3F5179;
    background-color: #D2D6E3;
	padding:6px 0 6px 0;
}
.shopex-switchable-content li {

	overflow: hidden;
	list-style:none;
	padding:0;
	margin:0;
	line-height:normal;
	border:none;
}
.slideshow-defau .shopex-switchable-triggerBox li{
    position: relative;
    }
</style>
<script>
var tabs = new Switchable('slideshow-<{$widgets_id}>', {
				triggersBox:'.shopex-switchable-triggerBox',
				content:'.shopex-switchable-content',
				circular:<{$setting.around|default:'true'}>,
				effect:'<{$setting.direction|default:fade}>'
			});
</script>
<{/if}>